import QtQuick 2.0
import Qt.labs.presentation 1.0

Slide {
    id: sldStyle
    property string wrongCode: "wrong"
    property string rightCode: "right"

    CheckBox {
        anchors { left: parent.left; top: parent.top }
        label: "Show correct"
        state: "disabled"
        onEnabled: sldStyle.state = "right"
        onDisabled: sldStyle.state = "wrong"
    }

    CodeSection {
        id: csStyleWrong
        width: parent.width * 0.70
        anchors { right: parent.right; top: parent.top
            rightMargin: 57
        }
        background: "red"
        text: sldStyle.wrongCode
    }

    CodeSection {
        id: csStyleRight
        width: parent.width * 0.70
        anchors { right: parent.right; top: parent.top
            rightMargin: 57
        }
        background: "green"
        text: sldStyle.rightCode
    }
    // TODO: animate the hide/showing

    state: "wrong"
    states: [
        State {
            name: "right"
            PropertyChanges {
                target: csStyleWrong
                opacity: 0.0
            }
            PropertyChanges {
                target: csStyleRight
                opacity: 1.0
            }
        },

        State {
            name: "wrong"
            PropertyChanges {
                target: csStyleWrong
                opacity: 1.0
            }
            PropertyChanges {
                target: csStyleRight
                opacity: 0.0
            }
        }
    ]

}
